<template>
  <div class="gold-shop-wrap">
    <van-nav-bar title="软件复购" left-arrow fixed @click-left="onClickLeft" />
    <!-- <div class="my-software-top">软件出售</div> -->
    <div>
      <van-form @submit="onSubmit" error-message-align="right">
        <van-field
          v-model="level_name"
          name="level_name"
          label="当前级别:"
          placeholder="当前级别"
          readonly
          input-align="right"
        />
        <van-field
          v-model="num"
          name="num"
          label="剩余库存:"
          placeholder="剩余库存"
          readonly
          input-align="right"
        />
        <van-field
          v-model="repeat_price"
          name="repeat_price"
          readonly
          label="软件单件:"
          placeholder="软件单件"
          input-align="right"
        />
        <van-field
          v-model="quantity"
          name="quantity"
          label="购买数量:"
          :placeholder="repeat_min_quantity?repeat_min_quantity:'请输入购买数量'"
          input-align="right"
          :rules="[{ required: true, message: '请输入购买数量' }]"
        />
        <!-- <van-field
          v-model="repeat_min_quantity"
          name="repeat_min_quantity"
          label="购买数量:"
          placeholder="购买数量"
          readonly
          input-align="right"
        /> -->
        <div style="margin: 16px;margin-top: 0.92rem;">
          <van-button
            color="linear-gradient(to right, #FF5851, #E9011B)"
            round
            block
            type="info"
            native-type="submit"
            >购买</van-button
          >
        </div>
      </van-form>
    </div>
  </div>
</template>
<script>
import { Dialog } from "vant";
import { SERVICE_BUY ,SOFTWARE_INFO} from "@/api/mine";
export default {
  data() {
    return {
      level: "",
      num: "",
      repeat_price: "",
      level_name: "",
      quantity: "",
      repeat_min_quantity:""
    };
  },
  created() {
    window.scrollTo(0, 0)

    this.initData();
  },
  methods: {
    initData() {
      this.$http.get(SOFTWARE_INFO).then((res) => {
        // this.software=res.data
        this.level = res.data.level;
        this.num = res.data.quantity;
        this.repeat_price = res.data.repeat_price + "元/套";
        this.level_name = res.data.level_name;
        this.repeat_min_quantity=res.data.repeat_min_quantity+'套起售'
      });
    },
    onClickLeft() {
      this.$router.back();
    },
    onSubmit(values) {
      let params = {
        type: 2,
        level: this.level,
        quantity: this.quantity,
      };
      this.$http.post(SERVICE_BUY, params).then((res) => {
        this.$router.push({ path: "/levelCashier" });
        res.data.expired_time =new Date().getTime() + res.data.expired_seconds * 1000;
        localStorage.setItem("cashOrder", JSON.stringify(res.data));
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.gold-shop-wrap {
//   min-height: 100vh;
  padding-top: 46px;
  // background: #F2F4F5;

  ::v-deep .van-nav-bar .van-icon {
    color: #333333;
  }

  ::v-deep .van-nav-bar__arrow {
    font-size: 20px;
  }

  ::v-deep .van-nav-bar__text {
    color: #333;
  }
}

.my-software-top {
  // padding: 0.2rem;
  width: 95%;
  margin: 0.2rem auto;
  box-sizing: border-box;
  font-size: 0.32rem;
  font-weight: bold;
}

.my-software-tips {
  // text-align: center;
  width: 95%;
  margin: 0 auto;
  margin-top: 0.64rem;
  font-size: 0.28rem;

  // line-height: 0.5rem;
  &-title {
    font-weight: bold;
    // font-size: 0.3rem;
    margin-bottom: 0.3rem;
  }

  &-content {
    color: #666666;
    font-size: 0.24rem;
  }
}
</style>
